<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Jay风琴</title>
    <link rel="stylesheet" href="jaycss.css">
</head>
<body>
    <script src="jquery.min.js"></script>
    <script type="text/javascript">
        $(function(){
            // 鼠标经过
            $(".jay>ul li").mouseenter(function(){
                // 小图淡出效果，大图淡入
                $(this).stop().animate({
                    width:370
                },200).find(".small").stop().fadeOut().siblings(".big").stop().fadeIn(); 
                $(this).siblings("li").stop().animate({
                    width:160
                }).find(".small").stop().fadeIn().siblings(".big").stop().fadeOut();           
            })
        })
    </script>
    <div class="tw">哎哟!不错哦</div>
    <div class="jay">
        <ul>
            <li class="tu">
                <!-- 链接图片 -->
                <a href="https://baike.baidu.com/item/%E5%8F%8D%E6%96%B9%E5%90%91%E7%9A%84%E9%92%9F/6616566?fromModule=lemma_search-box"target="_blank">
                    <img src="./tu/ffxdz_s.jpg" alt="" class="small">
                    <img src="./tu/ffxdz.jpg" alt="" class="big">
                </a>
            </li>
            <li>
                <a href="https://baike.baidu.com/item/%E4%B8%80%E8%B7%AF%E5%90%91%E5%8C%97/52259?fromModule=lemma_search-box"target="_blank">
                    <img src="./tu/ylxb_s.jpg" alt="" class="small">
                    <img src="./tu/ylxb.jpg" alt="" class="big">
                </a>
            </li> 
            <li>   
                <a href="https://baike.baidu.com/item/%E4%B8%83%E9%87%8C%E9%A6%99/12009481?fromModule=search-result_lemma-recommend"target="_blank">
                    <img src="./tu/qlx_s.png" alt="" class="small">
                    <img src="./tu/qlx.jpg" alt="" class="big">
                </a>
            </li>
            <li>
                <a href="https://baike.baidu.com/item/%E7%A8%BB%E9%A6%99/11539?fromModule=lemma_search-box"target="_blank">
                    <img src="./tu/dx_s.jpg" alt="" class="small">
                    <img src="./tu/dx.jpg" alt="" class="big">
                </a>
            </li>
            <li>
                <a href="https://baike.baidu.com/item/%E8%8A%B1%E6%B5%B7/9009691?fromModule=lemma_search-box" target="_blank">
                    <img src="./tu/hh_s.jpg" alt="" class="small">
                    <img src="./tu/hh.jpg" alt="" class="big">
                </a>
            </li>
            <li>
                <a href="以父之名.html"target="_blank">
                    <img src="./tu/yfzm_s.jpg" alt="" class="small">                   
                    <img src="./tu/yfzm.jpg" alt="" class="big">
                </a>
            </li>
            <li>
                <a href="https://baike.baidu.com/item/%E6%9C%AC%E8%8D%89%E7%BA%B2%E7%9B%AE/10619620?fromModule=lemma_search-box"target="_blank">
                    <img src="./tu/bcgm_s.jpg" alt="" class="small">
                    <img src="./tu/bcgm.jpg" alt="" class="big">
                </a>
            </li>
        </ul>
    </div>
</body>
</html>